<template>
  <div class="divBox relative">
    <el-card class="box-card" style="min-height: 80vh">
      <div slot="header" class="clearfix" style="margin-bottom: -20px ;">
        <div class="container">
          <el-form :inline="true" :model="queryForm" @submit.native.prevent>
            <el-form-item>
              <el-input v-model="queryForm.softwarename" placeholder="请输入软件名称" clearable @keyup.enter.native="search()"></el-input>
            </el-form-item>
            <el-form-item>
              <el-input v-model="queryForm.source" placeholder="请输入软件来源" clearable @keyup.enter.native="search()"></el-input>
            </el-form-item>
            <el-form-item>
              <el-select v-model="queryForm.gametype" placeholder="请选择软件类型" class="width100" filterable clearable>
                <el-option
                  v-for="item in softwareCategoryList"
                  :label="item.name"
                  :key="item.id"
                  :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-select v-model="queryForm.targerttype" placeholder="请选择打开方式" class="width100" filterable clearable>
                <el-option label="内部打开" :value="0"></el-option>
                <el-option label="外部打开" :value="1"></el-option>
              </el-select>
            </el-form-item>

            <el-form-item>
              <el-button @click="search()">查询</el-button>
              <el-button v-if="checkPermi(['softwareh5:index:save'])" type="primary" @click="addOrUpdateHandle()">新增数据</el-button>
            </el-form-item>
          </el-form>
        </div>
      </div>
      <el-table :data="dataList" v-loading="dataListLoading"  @selection-change="selectionChangeHandle" style="width: 100%;"
                size="mini" :highlight-current-row="true" :header-cell-style=" {fontWeight:'bold'}">

<!--        <el-table-column type="selection" header-align="center" align="center" width="50"/>-->

        <el-table-column prop="softwareid" label="id" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>
           <el-table-column  label="logo">
             <template slot-scope="scope"  >
               <el-image  fit="scaleDown"
                          :src="scope.row.softwarepath" :preview-src-list="[scope.row.softwarepath]">
               </el-image>
             </template>
           </el-table-column>
           <el-table-column prop="softwarename" label="标题" header-align="center" :show-overflow-tooltip="true" min-width="100"></el-table-column>

        <el-table-column prop="softwaremsg" label="副标题" header-align="center"  :show-overflow-tooltip="true" min-width="100"></el-table-column>


           <el-table-column prop="gametypeName" label="游戏类型" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="targerttype" label="打开方式" header-align="center" align="center" :show-overflow-tooltip="true">
          <template slot-scope="scope"  >
            <span v-if="scope.row.targerttype==0">内部打开</span>
            <span v-else>外部打开</span>
          </template>
        </el-table-column>

        <!--           <el-table-column prop="gametype" label="二级游戏类型" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
        <el-table-column  label="云玩地址"  prop="h5address"  header-align="center" :show-overflow-tooltip="true" min-width="200px">
        </el-table-column>
        <el-table-column prop="source" label="来源" header-align="center" align="center" ></el-table-column>


<!--        <el-table-column prop="applysize" label="应用大小" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="applyintroduce" label="应用介绍" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="welfarecontent" label="福利" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="majorfunction" label="主要功能" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="otherfunction" label="其他功能" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="candynum" label="糖果数量" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="hot" label="精品游戏(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="accidence" label="入门必备(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority" label="是否推荐(1推荐-2不推荐)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="visitnum" label="访问量" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="visitdaynum" label="每日访问量" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="appname" label="app名称" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--          <el-table-column prop="officialwebsiteaddress" label="官网" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->

<!--           <el-table-column prop="starttime" label="初始版本上传时间" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg1" label="详情图1" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg2" label="详情图2" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg3" label="详情图3" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg4" label="详情图4" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg5" label="详情图5" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg1long" label="" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg2long" label="" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg3long" label="" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg4long" label="" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="infoimg5long" label="" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->




<!--        <el-table-column prop="iosapplysize" label="ios包大小" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--        <el-table-column prop="iosuploadaddress" label="ISO下载地址" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--        <el-table-column prop="softwareiosfilepath" label="ios软件文件路径" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--        <el-table-column prop="softwareiosstart" label="ios的版本" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->



        <!--        <el-table-column prop="h5address" label="云玩地址" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--         <el-table-column prop="smallweavepriority" label="小编推荐(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="prioritysort" label="排行榜推荐(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority1" label="首页热门交易所(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="prioritywallet" label="首页主流钱包(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority2" label="首页行情资讯推荐(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority3" label="应用工具(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority4" label="首页出众新锐(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority5" label="区块链浏览器(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority6" label="首页区块链游戏(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority7" label="EOS专区热门推荐(1-8)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority8" label="游戏分类配置-热门游戏" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority9" label="游戏分类配置-最新游戏" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority10" label="游戏分类配置-经典回顾" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="priority11" label="游戏分类配置-推荐游戏" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="hotsearch" label="是否热门搜索(1否,2是)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="btversionstatus" label="应用的BT版本标识：1未设置、2Android已设置、3IOS已设置、4都已设置" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="downloadlimit" label="下载量限制" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="downloadcount" label="下载量统计" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="wordsheat" label="关键词热度" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="searchheat" label="检索热度" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="packagename" label="应用包名" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--        <el-table-column prop="appsign" label="应用签名" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->

<!--        <el-table-column prop="developerid" label="开发者(user_entity)编号" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="apppermission" label="应用权限获取说明" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="chargetype" label="收费类型：1免费、2收费、3部分功能收费、4部分内容收费" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="adstatus" label="广告状态：1无广告、2含广告、3内嵌广告、4通知栏广告" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="languetype" label="支持语言：1简体中文、2繁体中文、3英文、4其它" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="copyrightandroid" label="电子版权认证证书(安卓)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="proveandroid" label="证明材料(安卓)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="reportandroid" label="安全评估报告(安卓)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="urlschemaiphone" label="URL schema(iphone)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="appstoreidiphone" label="AppStoreId(iphone)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="bundleidiphone" label="bundle id(iphone)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="urlschemaipad" label="URL schema(ipad)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="appstoreidipad" label="AppStoreId(ipad)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="bundleidipad" label="bundle id(ipad)" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="checkmessage" label="应用审核描述" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="commentscore" label="应用的用户评分" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="versionno" label="Android版本号" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="videourl" label="应用的短视频介绍" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="pageinfourl" label="应用的PC端详情页链接地址" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="pageinfostatus" label="应用的PC端详情页状态：1未生成、2已生成" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--           <el-table-column prop="pageinfotime" label="应用的PC端详情页生成时间" header-align="center" align="center" :show-overflow-tooltip="true"></el-table-column>-->
<!--        <el-table-column prop="score" label="评分" header-align="center" align="center" :show-overflow-tooltip="true">-->
<!--          <template slot-scope="scope"  >-->
<!--            <span>{{scope.row.score+scope.row.scorex}}</span><span style="font-size:1px ">({{scope.row.scorex}})</span>-->
<!--          </template>-->
<!--        </el-table-column>-->
<!--        <el-table-column prop="downloadnum" label="打开次数" header-align="center" align="center" :show-overflow-tooltip="true">-->
<!--          <template slot-scope="scope"  >-->
<!--            <span>{{scope.row.downloadnum+scope.row.downloadnumx}}</span><span style="font-size:1px ">({{scope.row.downloadnumx}})</span>-->
<!--          </template>-->
<!--        </el-table-column>-->

        <el-table-column prop="softwarestatus" label="状态" header-align="center"  min-width="80">
          <template slot-scope="scope" >
            <el-switch
              v-model="scope.row.softwarestatus==1"
              :active-value="true"
              :inactive-value="false"
              active-text="上架"
              inactive-text="下架"
              @change="changeStatus(scope.row)"
            />
          </template>
        </el-table-column>
        <el-table-column prop="createtime" label="创建时间" header-align="center" align="center" :show-overflow-tooltip="true" width="150"></el-table-column>
        <el-table-column prop="modifytime" label="修改时间" header-align="center" align="center" :show-overflow-tooltip="true"  width="150"></el-table-column>

        <el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
          <template slot-scope="scope">
            <el-button type="text"  size="small" @click="jump(scope.row.h5address,'_blank')">试玩</el-button>
            <el-button type="text"  v-if="checkPermi(['softwareh5:index:update'])" size="small" @click="addOrUpdateHandle(scope.row.softwareid)">修改</el-button>
            <el-button type="text"  v-if="checkPermi(['softwareh5:index:delete'])" size="small" @click="deleteHandle(scope.row.softwareid)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
              @size-change="sizeChangeHandle"
              @current-change="currentChangeHandle"
              :current-page="tableForm.pageIndex"
              :page-sizes="[10, 20, 50, 100]"
              :page-size="tableForm.pageSize"
              :total="tableForm.total"
              layout="total, sizes, prev, pager, next, jumper">
      </el-pagination>
    </el-card>
    <!-- 表单弹窗, 新增数据和修改数据 -->
    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
  </div>
</template>

<script>
  import AddOrUpdate from './softwareh5-add-and-update'
  import api from '@/api/api'
  import {checkPermi} from "@/utils/permission";

  export default {
    components: {
      AddOrUpdate
    },
    data () {
      return {
        dataList: [],
        softwareCategoryList:[],
        queryForm: {
          softwarename: '',
          gametype: '',
          source:'',
          softwaretype:3,
          targerttype:''
        },
        tableForm:{
          pageIndex: 1,
          pageSize: 10,
          total: 0,
        },
        dataListLoading: false,
        dataListSelections: [],
        addOrUpdateVisible: false
      }
    },
    mounted () {
      this.getDataList()
      this.getSoftwareCategoryList();
    },
    methods: {
      checkPermi,
      search(){
        this.tableForm.pageIndex = 1
        this.getDataList()
      },
      // 获取数据列表
      getDataList () {
        this.dataListLoading = true
        this.dataListLoading = true
        let postData={
          'order':'desc',
          'column':'softwareid'
        }
        Object.assign(postData,this.queryForm, this.tableForm)
        postData.softwarename=api.getLikeValue(postData.softwarename)
          api.post('rest/vabc/softwareEntity/list',postData).then(res => {
            this.dataList=res.datalist
            this.tableForm.total=res.total
          }).finally(() => {
            this.dataListLoading = false
          });
      },
      // 每页数
      sizeChangeHandle (val) {
        this.tableForm.pageSize = val
        this.tableForm.pageIndex = 1
        this.getDataList()
      },
      // 当前页
      currentChangeHandle (val) {
        this.tableForm.pageIndex = val
        this.getDataList()
      },
      // 多选
      selectionChangeHandle (val) {
        this.dataListSelections = val
      },
      // 新增 / 修改
      addOrUpdateHandle (id) {
        this.addOrUpdateVisible = true
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(id)
        })
      },
      changeStatus(row){
        let postData={softwareid:row.softwareid}
        postData.softwarestatus=row.softwarestatus==1?0:1;
        api.post('rest/vabc/softwareEntity/updateById',postData).then(res => {
          this.$message.success("操作成功")
          row.softwarestatus=postData.softwarestatus
          // this.getDataList()
        })
      },
      // 删除
      deleteHandle (id) {
        var ids = id ? [id] : this.dataListSelections.map(item => {
          return item.softwareid
        })
        this.$confirm(`您确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let postData={ids:ids.join(',')};
          api.post('rest/vabc/softwareEntity/delete',postData).then(res => {
            this.$message.success("删除成功")
            this.getDataList()
          })
        })
      } ,getSoftwareCategoryList () {
        let postData={
          'order':'desc',
          'column':'sortnum,createtime',
          'pageSize':1000,
          'pageIndex':1,
        }
        //postData.key=postData.key.length==0?postData.key:'%'+postData.key+'%'
        api.post('rest/vabc/softwarecategory/list',postData).then(res => {
          this.softwareCategoryList=res.datalist
        }).finally(() => {
        });
      },
      jump(url,target){
        window.open(url, target)
      }
    }
  }
</script>
